<form id="<?php echo $uniqid;?>" method="post" style="padding: 8px;">
    <table border="0" width="100%" cellspacing="1" cellpadding="5" class="formtable">

        <tr bgcolor="#FFFFFF" style="height: 110px">
            <td class="tlabel" width="25%">将源账号：</td>
            <td width="30%"><input type="text" @input="getSource"
                                   class="forminput inputstyle validatebox-text textbox-prompt easyui-validatebox"
                                   placeholder="请输入源账号ID.." v-model="params.source_id">
            </td>
            <td width="45%">
                <div v-if="source.id"
                     style="display: flex;flex-direction:column;justify-content: center;align-items: center">
                    <div style="text-align: center;overflow:hidden;">
                        <img :src="source.avatar" style="border-radius: 30px" height="30px"/>
                    </div>
                    <div class="easyui-tooltip">
                        <p style="line-height: 25px;text-align: center; color: red;">ID：{{ source.id }}</p>
                        <p style="line-height: 25px;text-align: center">{{ source.nickname }} - {{ source.phone }}</p>
                    </div>
                </div>
            </td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td colspan="3" style="text-align: center">合并至</td>
        </tr>
        <tr bgcolor="#FFFFFF" style="height: 110px">
            <td class="tlabel" width="10%">目标账号：</td>
            <td><input type="text" @input="getTarget"
                       style="width: 130px;"
                       class="forminput inputstyle validatebox-text textbox-prompt easyui-validatebox"
                       placeholder="请输入目标账号ID.." required="true" v-model="params.target_id">
            </td>
            <td>
                <div v-if="target.id"
                     style="display: flex;flex-direction:column;justify-content: center;align-items: center">
                    <div style="text-align: center;overflow:hidden;">
                        <img :src="target.avatar" style="border-radius: 30px" height="30px"/>
                    </div>
                    <div class="easyui-tooltip">
                        <p style="line-height: 25px;text-align: center">ID：{{ target.id }}</p>
                        <p style="line-height: 25px;text-align: center">{{ target.nickname }} - {{ target.phone }}</p>
                    </div>
                </div>
            </td>
        </tr>
        <tr bgcolor="#FFFFFF">
            <td colspan="3">
                <p>Tips:</p>
                <p>
                    (1). 合并账号后, 源账号将会被删除, 保留目标账号.
                </p>
                <p>
                    (2). 源账号与目标账号的业绩, 订单及佣金将进行合并.
                </p>
                <p>
                    (3). 此操作不可逆, 请谨慎操作!!!
                </p>
            </td>
        </tr>
    </table>
</form>
<div id="memberMergeDlg" class="easyui-dialog" style="width:540px; height:540px;" title="信息框" closed="true"></div>

<script>
    var memberMergeVm = new Vue({
        el: '#<?php echo $uniqid;?>',
        data: {
            params: {
                source_id: '',
                target_id: '',
            },
            source: {},
            target: {},
        },
        methods: {
            getSource() {
                if (!this.params.source_id) {
                    return;
                }
                $.post('/admin/member/view', {id: this.params.source_id}, (data) => {
                    if (data.ret === 0) {
                        this.source = data.data;
                    }else{
                        this.source = {};
                    }
                }, 'json');
            },
            getTarget() {
                if (!this.params.target_id) {
                    return;
                }
                $.post('/admin/member/view', {id: this.params.target_id}, (data) => {
                    if (data.ret === 0) {
                        this.target = data.data;
                    }else{
                        this.target = {};
                    }
                }, 'json');
            },
            submit() {
                if (!this.source.id) {
                    $.messager.alert('提示', '源账号不存在', 'warning');
                    return;
                }
                if (!this.target.id) {
                    $.messager.alert('提示', '目标账号不存在', 'warning');
                    return;
                }
                $.messager.confirm('提示', '确定要将账号' + this.source.id + '合并至'+ + this.target.id +'吗？', function (r) {
                    if (r) {
                        showLoading('#<?php echo $uniqid;?>');
                        $.post('/admin/member/merge', memberMergeVm.params, function (data) {
                            hideLoading();
                            if (data.ret === 0) {
                                $.messager.show({
                                    title: '提示',
                                    msg: data.msg,
                                    timeout: 3000,
                                    showType: 'slide'
                                });
                                $("#memberdlg").dialog('close');
                                if (typeof (memberReload) == 'function') {
                                    memberReload();
                                }
                            } else {
                                $.messager.alert('提示', data.msg, 'warning');
                            }
                        }, 'json');
                    }
                });
            }
        }
    });
    $(function () {
        $('#membersubmit').click(function (data) {
            memberMergeVm.submit();
        });
    });
</script>
